const path = require('path')

const HTMLWebpackPlugin = require("html-webpack-plugin")
const {CleanWebpackPlugin} = require("clean-webpack-plugin")
const HtmlWebpackPlugin = require("html-webpack-plugin");


module.exports = {
    // 入口文件
    entry: "./src/index.ts",
    // 出口文件
    output: {
        path: path.resolve(__dirname, "dist"),
        filename: "bundle.js",
        environment: {
            arrowFunction: false,
            const: false
        }
    },
    mode: 'development',
    module: {
        rules: [
            {
                // 规则生效文件
                test: /\.ts$/,
                use: [{
                    loader: "babel-loader",
                    options: {
                        presets: [
                            [
                                '@babel/preset-env',
                                {
                                    targets: {
                                        "chrome": "88"
                                    },
                                    "corejs": "3",
                                    "useBuiltIns": "usage"
                                }
                            ]
                        ]
                    }
                }, 'ts-loader'],
                exclude: /node_modules/
            },
            // less文件处理
            {
                test:/\.less$/,
                // 从下往上执行
                use:[
                    "style-loader",
                    "css-loader",
                    {
                        loader: "postcss-loader",
                        options: {
                            postcssOptions:{
                                plugins: [
                                    [
                                        "postcss-preset-env",
                                        {
                                            browsers:"last 2 versions"
                                        }
                                    ]
                                ]
                            }
                        }
                    },
                    "less-loader"
                ]
            }
        ]
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            template: './src/index.html',
            filename: 'index.html',
            minify: {
                collapseWhitespace: true, // 干掉空格
                removeComments: true, // 干掉注释
                removeAttributeQuotes: true, // 干掉双引号
                removeEmptyAttributes: true // 干掉空属性
            }
        })
    ],
    resolve: {
        extensions: ['.ts', '.js']
    }
}
